    @import './mixin';
    #header{
        z-index:50 !important;
        background:rgba(0,0,0,0.4);
        width:30px;
        height:30px;
        line-height: 13px;
        text-align: center;
        border-radius: 50%;
        color:white;
    }
    #footer{
        width: 100%;
        background: #fff;
        display: flex;
        justify-content: space-around;
        padding: 8px 2px;
        position:fixed;
        bottom: 0px;
        z-index: 10;
        box-shadow: 0px -6px 8px 0px 
		rgba(185, 185, 185, 0.1);
        .collect{
            img{
                width: 17px;
                height: 17px;
                vertical-align: middle;
            }
            span{
                line-height: 44px;
                font-size: 13px;
                color: #666;
                display: inline-block;
                margin: {
                    left: 5px;
                }
            }
        }
        .freebtn{
            width: 100%;
            height: 44px;
        }
    }
	.cellone{
		border-radius:9px 9px 9px 9px;
	}
    .sliders{
        height:270px;
    }
	.titles{
        width:100%;
		position:relative;
		top:-30px;
		z-index:1;
		background:white;
        border-radius: 15px 15px 0 0;
        .choice{
            position: absolute;
            right: 20px;
            width: 29px;
            height: 32px;
            top: -3px;
        }
        >div:first-child{
            height:60px;
            padding:14px 0 14px 30px;
            >div:first-child{
                >h5{
                    line-height:22px;
                    letter-spacing: 0px;
                    line-height: 18px;
                    font-size:19px;
                    color:#333333;
                    font-weight:500;
                }
            }
        }
        >div:nth-child(3){
            padding:15px 20px 15px 45px;
            line-height: 22px;
            color:#6C6C6C;
            // border-bottom:1px solid #f4f4f4;
            img{
                width: 9px;
                height: 13px;
                margin-right: 7px;
            }
        }
        >div:nth-child(4){
            padding:15px 0 15px 45px;
            color:#6C6C6C;
            img{
                width: 10px;
                height: 10px;
                margin-right: 5px;
            }
        }
        .uls{
            border-top:1px solid #f4f4f4;
            border-bottom:1px solid #f4f4f4;
            padding:10px 10px 10px 10px;
            .bor{
                border-right:1px solid #f4f4f4;
                text-align: center;
                font-weight: 200 !important;
                h3{
                    font-size:20px;
                    font-weight:500;
                }
                h5{
                    font-size:13px;
                }
            }
            .blu{
                color:#007BFF;
                text-align: center;
                font-weight: 200;
            }
            .las{
               text-align: center; 
               h3{
                    font-size:20px;
                    font-weight:500;
                }
                h5{
                    font-size:13px;
                }
            }
        }
	}
	.mui-content>img{
		width:100%;
	}
	.firstcard{
        margin-top:-25px;
        background:white;
        padding-bottom: 30px;
        .special{
            font-size:19px;
            color:#333333;
            font-weight: 500;
            padding: {
                left:30px;
                top: 20px;
                bottom: 18px;
            }
            font-size: 17px;
            color: #333;
            border: {
                bottom: 1px solid #f4f4f4;
                top: 10px solid #f4f4f4;
            }
        }
        >#swiperFeature{
            position:relative;
            >div{
                padding-top:15px;
                padding-bottom: 35px;
                >div{ 
                    text-align: center !important;
                    img{
                        width:60px;
                        height:60px;
                    }
                    h5{
                        font-size:12px;
                        color:rgb(153,153,153)
                    }
                }
            }
        }
        #swiperFeature{
            .swiper-pagination{
                position:absolute;
                height:5px !important;
                line-height:2px;
                position:absolute;
                bottom: -15px !important;
                .swiper-pagination-bullet{
                    background: rgb(0,123,255) !important;
                    opacity: 0.5;
                    &.swiper-pagination-bullet-active{
                    opacity: 1;
                    }
                }
            }
        }
        
    }
    .build_infor{
        margin-top:-30px;
		background:white;
        padding-bottom:30px;
        border-top: 10px solid #f4f4f4;
        .top{
            height:60px;
            line-height: 60px;
            border-bottom: 1px solid #f4f4f4;
            >h3{
                font-size:19px;
                color:#333333;
                font-weight:500;
                padding:20px 0 20px 30px;
            }
        }
        >div:nth-child(2){
            >.mui-row{
                padding-top:10px;
                >div:first-child>h4{
                    font-size: 14px;
                    color:#8F8F94;
                    padding-left:30px;
                    font-weight: 400;  
                }
                >div:nth-child(2)>h4{
                    font-size:14px;
                    font-weight: 400;
                    margin-left:15px;
                }
            }
            
        }
        
	}
	.advantage{
        background:white;
        border-top: 10px solid #f4f4f4;
        border-bottom: 10px solid #f4f4f4;
        >.top{
            height:60px;
            line-height: 60px;
            border-bottom: 1px solid #f4f4f4;
            >h3{
                font-size:19px;
                color:black;
                font-weight:500;
                padding:20px 0 20px 0;
                text-align:center;
            }
        }
        >div:nth-child(2){
            padding:15px;
        }
    }
    .active{
        color:orange;
    }
    .periphery{
		background: white;
        margin:0px 0;
        border-top: 10px solid #f4f4f4;
        >img{
            width: 100%;
        }
        >.top{
            height:60px;
            line-height: 60px;
            text-align: center;
            padding:20px 0 20px 25px;
           >h3{
                font-size:19px;
                color:black;
                font-weight:500;
            } 
        }
        >div:nth-child(2){
            padding-left:15px;
            padding-right:15px;
            #secondmap{
                width:100%;
                height:280px;
                margin-bottom:15px;
                background: white;
            }
        }
        >ul{
            padding:0 10px;
            // margin-top:20px;
            border-top:0 !important;
            display: flex;
            justify-content: space-between;
            >li{
                list-style: none;
                float:left;
                >div{
                    text-align: center;
                    &:nth-child(1){
                        height:45px;
                        >img{
                            width:80%;
                        }
                    }
                }
            }
        }
	}

